<!-- <template>
  <div class="mb-4">
    <el-button type="danger" :icon="Delete" circle />
    <el-button type="danger">Danger</el-button>
    <div v-if="Flag">
      <ul>
        <li v-for="item in srcList" :key="item.id">
          <img :src="item.imageLine" alt="" />
          <span>{{ item.nickname }}</span>
        </li>
      </ul>
      <ul v-if="imgFlag">
        <li v-for="item in imgList" :key="item.id">
          <img :src="item.imgUrl" alt="" />
        </li>
      </ul>
    </div>
    <img src="../assets/image/1.jpg" alt="" />
  </div>
</template>

<script lang="ts" setup>
import { Delete } from "@element-plus/icons-vue";
import { getList, getImage } from "@/api/getList";
import { reactive, ref } from "vue";

let Flag = ref(false);
let imgFlag = ref(false);
let srcList = reactive<{ id: number; imageLine: string; nickname: string }[]>([]);
let imgList = reactive<{ id: number; imgUrl: string }[]>([]);
const getScrList = async () => {
  let res = await getList();
  srcList = res.data.data;
  if (srcList.length > 1) {
    Flag.value = true;
  }
  console.log(srcList, "res");
};
const getImageList = async () => {
  let res = await getImage();
  // console.log(res, "res");
  imgList = res.data.data;
  if (imgList.length > 1) {
    imgFlag.value = true;
  }
  console.log(imgList, "res");
};
getScrList();
getImageList();
</script> -->

<!-- 生产环境 -->
<template>
  <div class="mb-4">
    <el-button type="danger" :icon="Delete" circle />
    <el-button type="danger">Danger</el-button>
    <img src="../assets/image/1.jpg" alt="" />
  </div>
</template>

<script lang="ts" setup>
import { Delete } from "@element-plus/icons-vue";
</script>
